<template>
	<NavBar :obj="{ title: '支付成功', color: '#000000' ,leftIcon:''}" />

	<view class="container flex flex-col items-center justify-between">
		<image src="/static/order/ic_zfsucess.png" class="icon"></image>

		<view class="title">支付成功</view>
		
		<view class="container flex items-center justify-between">
			<view class="border-btn" @click="goIndex('/pages/index')">返回首页</view>
			<view class="btn" @click="goIndex('/pages/order/my_order?status=2')">查看订单</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { onLoad, onShow } from '@dcloudio/uni-app';
	import { port, goIndex } from '/service/port';

	// const desc = ref('');
	// const id = ref('');

	// onLoad((e) => {
	// 	if (e.id) {
	// 		id.value = e.id;
	// 	}
	// });

	// onShow(() => {
	// 	paySuccess();
	// });
	// async function paySuccess() {
	// 	let res = await port('paySuccess', { id: id.value });
	// 	desc.value = res.data;
	// }
</script>

<style scoped lang="scss">
	:global(page) {
		background-color: #f4f5f8;
	}

	.container {
		.icon {
			margin-top: 180rpx;
			width: 322rpx;
			height: 180rpx;
		}

		.title {
			font-weight: 500;
			font-size: 48rpx;
			color: #000000;
			margin-top: 53rpx;
		}

		.desc {
			font-weight: 400;
			font-size: 26rpx;
			color: #999999;
			margin-top: 26rpx;
		}

		.container {
			margin-top: 121rpx;
			gap: 28rpx;
			.border-btn {
				font-weight: 500;
				font-size: 30rpx;
				color: $theme-color;
				border-radius: 41rpx;
				border: 1px solid $theme-color;
				padding: 19rpx 89rpx;
			}
			.btn {
				font-weight: 500;
				font-size: 30rpx;
				color: #ffffff;
				background: $theme-bg-btn-color;
				border-radius: 41rpx;
				padding: 21rpx 89rpx;
			}
		}
	}
</style>
